const webpack = require('webpack');
const { resolve } = require('path');
const common = require('./common');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const { merge } = require('webpack-merge');

module.exports = merge(common, {
  mode: 'production',
  devtool: 'nosource-source-map',
  optimization: {
    // 尽可能将所有模块合并输出到一个函数中
    // 既提高了运行效率，又减小了输出代码的体积
    // 也被称作 scope hosting 作用域提升
    concatenateModules: true,
    splitChunks: {
      chunks: "all",   // 共有3个值"initial"，"async"和"all"。配置后，代码分割优化仅选择初始块，按需块或所有块
      minSize: 30000,   // （默认值：30000）块的最小大小
      minChunks: 1,    // （默认值：1）在拆分之前共享模块的最小块数
      maxAsyncRequests: 5,   //（默认为5）按需加载时并行请求的最大数量
      maxInitialRequests: 3,  //（默认值为3）入口点的最大并行请求数
      automaticNameDelimiter: '~',  // 默认情况下，webpack将使用块的来源和名称生成名称，例如vendors~main.js
      name: true,
      cacheGroups: {  // 以上条件都满足后会走入cacheGroups进一步进行优化的判断
        vendors: {
          test: /[\\/]node_modules[\\/]/,  // 判断引入库是否是node_modules里的
          priority: -10,   // 数字越大优先级越高 （-10大于-20）
          filename: 'vendors.js'  // 设置代码分割后的文件名
        },
        default: {   //所有代码分割快都符合默认值，此时判断priority优先级
          minChunks: 2,
          priority: -20,
          reuseExistingChunk: true   // 允许在模块完全匹配时重用现有的块，而不是创建新的块。
        }
      }
    }
  },
  output: {
    // 一般在webpack和plugin的filename中 都支持占位符
    // hash: 普通hash 每次都会改变\
    // chunkhash: 同一路径的文件为同一hash
    // contenthash: 文件改变hash才会改变 这个最适合打包用
    // 可以加一个 :number 控制hash的长度 否则默认20位
    filename: '[name]-[contenthash:8].bundle.js',
    path: resolve(__dirname, '../www'),
    publicPath: '',
  },
  plugins: [
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: '"development"'
      }
    }),
    new CopyWebpackPlugin({
      patterns: [
        { from: './part2/module2/webpack/assets', to: 'public' },
      ],
    }),
  ]
})